<template>
	<div class="hospital-level">
		<div class="title">等级：</div>
		<ul class="level-list">
			<li class="active">全部</li>
			<li>三级甲等</li>
			<li>三级乙等</li>
			<li>二级甲等</li>
			<li>二级乙等</li>
			<li>一级</li>
		</ul>
	</div>
</template>

<script lang="ts">
	export default {
		name: 'HospitalLevel',
	};
</script>

<script setup lang="ts"></script>

<style scoped lang="scss">
	.hospital-level {
		display: flex;
		margin-bottom: 20px;

		.title {
			flex-shrink: 0;
		}

		.level-list {
			display: flex;

			.active {
				color: #6fbaff;
			}

			li {
				padding: 0 10px;
			}

			li:hover {
				cursor: pointer;
				color: #6fbaff;
			}
		}
	}
</style>
